<template>
    <el-form ref="loginForm" :model="form" :rules="rules" label-width="0" size="large" @keyup.enter="login">
        <el-form-item prop="user">
            <el-input v-model="form.user" prefix-icon="el-icon-user" clearable :placeholder="$t('login.userPlaceholder')"></el-input>
        </el-form-item>
        <el-form-item prop="password">
            <el-input v-model="form.password" prefix-icon="el-icon-lock" clearable show-password :placeholder="$t('login.PWPlaceholder')"></el-input>
        </el-form-item>
        <el-form-item style="margin-bottom: 10px;">
            <el-col :span="12">
                <el-checkbox :label="$t('login.rememberMe')" v-model="form.autologin"></el-checkbox>
            </el-col>
            <el-col :span="12">
                <el-checkbox label="记住密码" v-model="form.isRemember"></el-checkbox>
            </el-col>
        </el-form-item>
        <!-- <el-form-item>
            <el-col>
                <div class="uoload">
                    <img style="width: 22px;height: 22px" src="@/assets/image/upload.png" alt="">
                    <div style="margin-left: 10px">您也可以</div>
                    <el-link type="primary" :underline="false" @click="upLoad">下载我们的软件</el-link>
                </div>
            </el-col>
            <el-col>
                <div class="uoload">
                    <img style="width: 22px;height: 22px" src="@/assets/image/weixin.png" alt="">
                    <el-link style="margin-left: 10px" type="primary" :underline="false" @click="dialog.image = true">微信在线客服</el-link>
                </div>
            </el-col>
        </el-form-item> -->
        <el-form-item>
            <el-button type="primary" style="width: 100%;" :loading="islogin" round @click="login">{{ $t('login.signIn') }}</el-button>
            <!-- <div style="width: 100%;text-align: right;">
                <span style="font-size: 14px;color: #409EFF;font-weight: 500;" @click="toRegister">去注册</span>
            </div> -->
        </el-form-item>
    </el-form>
    <el-dialog v-model="dialog.image" width="420" :before-close="handleClose" align-center>
        <img style="width: 380px;height: 100%" src="@/assets/image/kefu.jpg" alt="">
    </el-dialog>
</template>

<script>
import config from '@/config'
export default {
    data() {
        return {
            userType: 'admin',
            dialog: {
                image: false,
            },
            form: {
                user: "",
                password: "",
                autologin: false,
                isRemember: false,
            },
            rules: {
                user: [
                    { required: true, message: this.$t('login.userError'), trigger: 'blur' }
                ],
                password: [
                    { required: true, message: this.$t('login.PWError'), trigger: 'blur' }
                ]
            },
            islogin: false,
        }
    },
    watch: {
        // userType(val){
        // 	if(val == 'admin'){
        // 		this.form.user = 'admin'
        // 		this.form.password = ''
        // 	}else if(val == 'user'){
        // 		this.form.user = 'user'
        // 		this.form.password = 'user'
        // 	}
        // }
    },
    mounted() {
        if (this.$TOOL.data.get("isRemember") && this.$TOOL.data.get("isRemember").isRemember) {
            this.form.isRemember = this.$TOOL.data.get("isRemember").isRemember
            this.form.password = this.$TOOL.data.get("isRemember").password
            this.form.user = this.$TOOL.data.get("isRemember").user
            this.form.autologin = this.$TOOL.data.get("isRemember").autologin
        }
    },
    methods: {
        toRegister() {
            this.$router.push({ path: "/user_register" })
        },
        async login() {
            var validate = await this.$refs.loginForm.validate().catch(() => {
            })
            if (!validate) {
                return false
            }

            this.islogin = true
            var data = {
                account: this.form.user,
                password: this.form.password,
                terminal: 1
            }
            //获取token
            var user = await this.$API.auth.token.post(data)
            if (user.code == 1) {
                this.$TOOL.cookie.set("TOKEN", user.data.token, {
                    expires: this.form.autologin ? 24 * 60 * 60 : 0
                })
                this.$TOOL.data.set("USER_INFO", user.data.userInfo)
                console.log('user.data.userInfo :>> ', user.data.userInfo);
                if (this.form.isRemember) {
                    //记住密码
                    this.$TOOL.data.set("isRemember", this.form)
                } else {
                    this.$TOOL.data.set("isRemember", '')
                }
            } else {
                this.islogin = false
                this.$message.warning(user.message)
                return false
            }
            //获取菜单
            var menu = null
            // if(this.form.user == 'admin'){
            menu = await this.$API.system.menu.myMenus.get()
            // }else{
            // 	menu = await this.$API.demo.menu.get()
            // }
            if (menu.code == 1) {
                // if (menu.data.menu.length == 0) {
                //     this.islogin = false
                //     this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                //         type: 'error',
                //         center: true
                //     })
                //     return false
                // }
                this.$TOOL.data.set('admincolumn', menu.data.admincolumn)
                this.$TOOL.data.set("MENU", menu.data.menu)
                this.$TOOL.data.set("PERMISSIONS", menu.data.permissions)
                this.$TOOL.data.set("COLUMNSAUTH", menu.data.columnsauth)
                this.$TOOL.data.set("DASHBOARDGRID", menu.data.dashboardGrid)
                //设置拥有菜单的第一个菜单为默认打开的页面
                if (menu.data.menu && menu.data.menu[0] && menu.data.menu[0].children && menu.data.menu[0].children && menu.data.menu[0].children.length > 0) {
                    this.dashboard_url = menu.data.menu[0].children[0].children[0].path
                } else {
                    this.dashboard_url = '/business/purchase/plan'
                }
                //如果没有  就走默认的页面
                if (this.dashboard_url) {
                    // 设置默认打开的页面
                    this.$TOOL.data.set("DASHBOARD_URL", this.dashboard_url)
                    this.$router.push({
                        path: this.dashboard_url
                    })
                } else {
                    this.$router.replace({
                        path: '/'
                    })
                }
            } else {
                this.islogin = false
                this.$message.warning(menu.message)
                return false
            }
            this.$message.success("登录成功")
            this.islogin = false
        },
        upLoad() {
            window.location.href = `${config.API_URL}/ERP.exe`
        },
    }
}
</script>

<style>
.uoload {
    font-size: 14px;
    color: #666666;
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
